<template>
	<div class="container">
		<!-- 面包屑导航 -->
		<div class="breadcrumb">
			<el-breadcrumb separator="">
				<el-breadcrumb-item>
					<div class="div1">订单管理</div>
				</el-breadcrumb-item>
				<el-breadcrumb-item>
					<div class="div2" @click="toOrder">异常详情</div>
				</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<!-- 面包屑导航 -->
		<div class="basic">
			<p class="header">订单信息</p>
			<ul class="ul">
				<li>
					<p v-if="
              queryType.fixDetail == 2 ||
                (queryType.exType == 0 &&
                  queryType.fixDetail == 1 &&
                  !tableData.parcelNumber) ||
                tableData.parcelNumber == 1
            ">
						原订单编号：{{ tableData.orderId }}
					</p>
					<p>订单编号：{{ tableData.returnOrderId }}</p>
					<p v-if="queryType.orderType == 1 && queryType.exType == 1">
						订单状态： 被退货中
					</p>
					<p v-if="
              Number(queryType.orderType) === 0 &&
                Number(queryType.exType) === 1
            ">
						订单状态： 拒收中
					</p>
					<p v-if="
              queryType.exType == 0 &&
                (queryType.orderType == 2 ||
                  queryType.orderType == 1 ||
                  !queryType.orderType)
            ">
						订单状态：
						{{
              tableData.returnStatusName ? tableData.returnStatusName : "退货中"
            }}
					</p>
					<p>时 间 ：{{ tableData.applyTime }}</p>
					<p>客服：{{ tableData.applyName }}</p>
				</li>
				<li>
					<span>客户信息 ：</span>
					<span>{{ tableData.customerName }}</span>
					<span>{{ tableData.customerPhone }}</span>
					<span>{{ tableData.detailedAddress }}</span>
				</li>
				<li>
					<span>收货信息 ：</span>
					<span>{{ tableData.addressName }}</span>
					<span>{{ tableData.addressPhone }}</span>
					<span>{{ tableData.address }}</span>
				</li>
				<li>
					<span>备注 ：</span>
					<span v-if="tableData.comment">{{tableData.comment}}</span>
					<span v-else>无</span>
				</li>
				<li v-if="
            queryType.fixDetail == 2 ||
              (queryType.exType == 0 &&
                queryType.fixDetail == 1 &&
                !tableData.parcelNumber) ||
              tableData.parcelNumber == 1
          ">
					<span>包裹单号 ：</span>
					<span>{{ tableData.logisticsCompany }} {{ tableData.parcelNumber }}</span>
				</li>

				<div class="contentTemp" v-if="
            queryType.exType == 0 &&
              queryType.fixDetail == 1 &&
              tableData.parcelNumber &&
              tableData.parcelNumber != 1
          ">
					<div class="fontTemp">
						<p><span>*</span>退货单号:</p>
						<div>
							<el-select v-model="logisticsCompany" placeholder="快递公司" filterable clearable size="mini">
								<el-option v-for="itemsS in companys" :key="itemsS.dictName" :label="itemsS.dictName" :value="itemsS.dictName"></el-option>
							</el-select>
						</div>
						<div>
							<el-input size="mini" type="text" placeholder="请输入包裹物流单号" v-model="logistCode"></el-input>
						</div>
					</div>
				</div>
			</ul>
		</div>
		<div class="goods">
			<p class="header">商品详情</p>
			<span> 商品 </span>
			<el-table :data="tableData.orderReturnCommodityList" style="width: 100%" align="center">
				<el-table-column label="品牌" prop="brand"></el-table-column>
				<el-table-column label="商品名称" prop="commodityName"></el-table-column>
				<el-table-column label="原订单数" prop="originalNumber"></el-table-column>
				<el-table-column v-if="
            queryType.exType == 0 &&
              (queryType.orderType == 2 ||
                queryType.orderType == 1 ||
                !queryType.orderType) &&
              queryType.fixDetail == 2
          "
				 label="退货数量" prop="number"></el-table-column>
				<el-table-column v-if="queryType.exType == 0 && queryType.fixDetail == 1" label="可退货数量" prop="waitNumber"></el-table-column>
				<el-table-column v-if="
            queryType.exType == 0 &&
              queryType.fixDetail == 1 &&
              queryType.type == 'A'
          "
				 label="退货数量" width="150">
					<template slot-scope="scope">
						<div class="numer">
							<el-input-number v-model="scope.row.numberC" :min="0" size="mini" :max="scope.row.waitNumber" label="描述文字"></el-input-number>
						</div>
					</template>
				</el-table-column>

				<el-table-column label="仓库收货" width="150" v-if="
            (queryType.exType == 1 &&
              (queryType.orderType == 0 || queryType.orderType == 1)) ||
              (queryType.exType == 0 && queryType.fixDetail == 2)
          ">
					<template slot-scope="scope">
						<div class="numer">
							<span>已收：{{ scope.row.receivedNo }}</span>
							<span>破损：{{ scope.row.destroyNo }}</span>
							<span>漏件：{{ scope.row.brokenNo }}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="单价" prop="price"></el-table-column>
				<el-table-column label="规格" prop="specificationName"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 1 && this.queryType.orderType == 1" label="被退货小计" prop="total"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 1 && this.queryType.orderType == 0" label="拒收小计" prop="total"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 0" label="退货小计" prop="total"></el-table-column>
			</el-table>

			<span> 赠品 </span>
			<el-table :data="tableData.orderReturnComplimentaryList" style="width: 100%" align="center">
				<el-table-column label="品牌" prop="brand"></el-table-column>
				<el-table-column label="商品名称" prop="complimentaryName"></el-table-column>
				<el-table-column label="原订单数" prop="originalNumber"></el-table-column>
				<el-table-column v-if="
            queryType.exType == 0 &&
              (queryType.orderType == 2 ||
                queryType.orderType == 1 ||
                !queryType.orderType) &&
              queryType.fixDetail == 2
          "
				 label="退货数量" prop="number"></el-table-column>
				<el-table-column v-if="queryType.exType == 0 && queryType.fixDetail == 1" label="可退货数量" prop="waitNumber"></el-table-column>
				<el-table-column v-if="queryType.exType == 0 && queryType.fixDetail == 1" label="退货数量" width="150">
					<template slot-scope="scope">
						<div class="numer">
							<el-input-number v-model="scope.row.numberC" :min="0" size="mini" :max="scope.row.waitNumber" label="描述文字"></el-input-number>
						</div>
					</template>
				</el-table-column>
				<el-table-column v-if="
            (queryType.exType == 1 &&
              (queryType.orderType == 0 || queryType.orderType == 1)) ||
              (queryType.exType == 0 && queryType.fixDetail == 2)
          "
				 label="仓库收货" width="200">
					<template slot-scope="scope">
						<div class="numer">
							<span>已收：{{ scope.row.receivedNo }}</span>
							<span>破损：{{ scope.row.destroyNo }}</span>
							<span>漏件：{{ scope.row.brokenNo }}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="单价" prop="price"></el-table-column>
				<el-table-column label="规格" prop="specificationName"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 1 && this.queryType.orderType == 1" label="被退货小计" prop="total"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 1 && this.queryType.orderType == 0" label="拒收小计" prop="total"></el-table-column>
				<el-table-column v-if="this.queryType.exType == 0" label="退货小计" prop="total"></el-table-column>
			</el-table>
		</div>
		<div class="total">
			<div class="before">
				<p>原单总计</p>
				<p>共 {{ tableData.orderNumber }} 件</p>
				<p>运费：￥{{ tableData.orderCharge }}</p>
				<p>赠品总价： ￥0</p>
				<p>商品总价：￥{{ tableData.orderTotal }}</p>
				<p>应收金额：￥{{ tableData.orderMoney }}</p>
				<p>已收金额：￥{{ tableData.orderReceivedMoney }}</p>
				<p>代收金额：￥{{ tableData.orderAwaitIncomeMoney }}</p>
			</div>
			<div class="back" v-if="
          (queryType.exType == 0 &&
            (queryType.orderType == 2 || queryType.orderType == 1)) ||
            !queryType.orderType
        ">
				<p>退货总计</p>
				<p>共 {{ totalCout(1) }} 件</p>
				<!-- <p>商品总价 ￥{{ totalCout(2) }}</p> -->
			</div>
			<div class="totalAll" v-if="queryType.exType != 0">
				<span>仓库收货总计</span>
				<span>已收 {{ test(0) }} 件</span>
				<span>破损 {{ test(1) }} 件</span>
				<span>漏件 {{ test(2) }} 件</span>
				<span>已收货总价 ￥ {{ totalCout(2) }}</span>
			</div>
			<div class="deal">
				<div style="width:200px;text-align:left;">
					<!-- <p>已收金额： ￥{{ tableData.returnMoney }}</p> -->
					<p>已收金额： ￥{{ tableData.orderReceivedMoney }}</p>
					<div>
						<!-- <p><span></span>应退金额：￥{{ totalCout(2) }}</p> -->
						<!-- <p><span></span>应退金额：￥{{ totalCout(2) }}</p> -->
					</div>
					<div style="text-align:left;" v-if="queryType.fixDetail == 2">
						<p><span></span>实退金额：￥{{ tableData.returnMoney }}</p>
						<p><span></span>已退总金额：￥{{ tableData.orderResponse.orderUser.returnMoneyAll }}</p>
					</div>
					<div style="text-align:left;" v-if="queryType.fixDetail == 1">
						<p>实退金额</p>
						<p>
							<el-input-number v-if="
                  (queryType.exType == 1 &&
                    queryType.orderType == 1 &&
                    queryType.fixDetail == 1) ||
                    (queryType.exType == 0 && queryType.fixDetail == 1)
                "
							 style="width:100px;" :min="0" :max="totalCout(2)" :controls="false" @input="inp" :value="tableData.returnMoney"></el-input-number>
						</p>
					</div>
				</div>
			</div>
		</div>
		<div class="notes" v-if="queryType.fixDetail == 1">
			<p class="header">备注</p>
			<div>
				<el-input type="textarea" v-model="textarea" placeholder="请输入需要备注信息....."></el-input>
			</div>
		</div>
		<div class="submit" v-if="
        parArray.indexOf('submitJl') == -1 &&
          tableData.returnStatus == 1 &&
          queryType.fixDetail == 1
      ">
			<p style="" v-if="
          (((queryType.orderType == 2 || queryType.orderType == 1) &&
            queryType.exType == 0) ||
            !queryType.orderType) &&
            parArray.indexOf('byReturnCode') == -1
        "
			 @click="submintEvent">
				提交退货
			</p>
			<p v-if="
          Number(queryType.orderType) === 1 &&
            Number(queryType.exType) === 1 &&
            parArray.indexOf('byReturnCode') == -1
        "
			 @click="submintEvent">
				提交被退货
			</p>
			<p v-if="
          Number(queryType.orderType) === 0 &&
            Number(queryType.exType) === 1 &&
            parArray.indexOf('byReturnCode') == -1
        "
			 @click="submintEvent">
				提交拒收
			</p>
			<p v-if="queryType.exType != 0 && parArray.indexOf('byReturnCode') != -1" @click="submintEvent">
				关闭
			</p>
		</div>
		<div class="submit" v-if="
        (parArray.indexOf('submitJl') != -1 &&
          tableData.returnStatus == 1 &&
          queryType.fixDetail == 1) ||
          (parArray.indexOf('byReturnCode') != -1 &&
            queryType.exType == 0 &&
            queryType.fixDetail == 1)
      ">
			<p @click="(dialogVisible = true), (rejectType = 0)" style="background:#fff;color:#4168E7;border:1px solid #4168E7;margin-right:20px;height:28px;">
				驳回
			</p>
			<p @click="(dialogVisible = true), (rejectType = 1)">
				批准
			</p>
		</div>
		<div class="oldOrder">
			<div class="title">
				关联原订单号
			</div>
			<el-table :data="oldOrder" style="width:100%;">
				<el-table-column type="expand">
					<template slot-scope="scope">
						商品
						<el-table border :data="tableData.orderResponse.orderCommodityList" style="width:100%;">
							<el-table-column label="图片">
								<template slot-scope="scope">
									<el-image style="width: 100px; height: 100px" :src="img(scope.row.image)" fit="cover"></el-image>
								</template>
							</el-table-column>
							<el-table-column prop="brandName" label="品牌"></el-table-column>
							<el-table-column prop="name" label="商品名称"></el-table-column>
							<el-table-column prop="number" label="商品数量"></el-table-column>
							<el-table-column prop="price" label="单价"></el-table-column>
							<el-table-column label="规格" prop="specificationName">
							</el-table-column>
							<el-table-column prop="total" label="商品小计"></el-table-column>
						</el-table>
						赠品
						<el-table border :data="tableData.orderResponse.orderComplimentaryList" style="width:100%;">
							<el-table-column label="图片">
								<template slot-scope="scope">
									<el-image style="width: 100px; height: 100px" :src="img(scope.row.image)" fit="cover"></el-image>
								</template>
							</el-table-column>
							<el-table-column prop="brandName" label="品牌"></el-table-column>
							<el-table-column prop="complimentaryName" label="商品名称"></el-table-column>
							<el-table-column prop="number" label="商品数量"></el-table-column>
							<el-table-column prop="price" label="单价"></el-table-column>
							<el-table-column label="规格" prop="specificationName">
							</el-table-column>
							<el-table-column prop="total" label="商品小计"></el-table-column>
						</el-table>
					</template>
				</el-table-column>
				<el-table-column prop="orderId" label="订单编号"></el-table-column>
				<el-table-column prop="customerUserName" label="客户"></el-table-column>
				<el-table-column prop="createdName" label="客服"></el-table-column>
				<el-table-column prop="orderType" label="订单状态"></el-table-column>
				<el-table-column prop="receivedMoney" label="金额"></el-table-column>
				<el-table-column label="包裹单号">
					<template slot-scope="scope">
						{{scope.row.logisticsOrder.parcelNumber}}
					</template>
				</el-table-column>
				<el-table-column label="收货信息">
					<template slot-scope="scope">
						<span>{{ scope.row.addressName }}</span>
						<span> {{ scope.row.addressPhone }} </span>
						<span> {{ scope.row.address }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="createdTime" label="下单时间"></el-table-column>
				<!-- <el-table-column label="操作">
					<template>
						<span style="color:#5276E9;cursor: pointer;">详情</span>
					</template>
				</el-table-column> -->
			</el-table>
		</div>

		<el-dialog title="批准驳回操作" append-to-body :visible.sync="dialogVisible" width="30%">
			<el-input type="textarea" autosize placeholder="请输入内容" v-model="textarea1">
			</el-input>

			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible = false">取 消</el-button>
				<el-button type="primary" @click="reject">确 定</el-button>
			</span>
		</el-dialog>
		<div style="height:60px;"></div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				dialogVisible: false,
				rejectType: 0,
				textarea1: "",
				logistCode: "",
				logisticsCompany: "",
				companys: [],
				queryType: this.$route.query,
				oldOrder: [],
				tableData: {
					orderResponse: {
						orderUser: {},
					},
					orderReturnCommodityList: [],
					orderReturnComplimentaryList: [],
				},
				textarea: "",
				salay: 0,
				limits: [],
				parArray: [],
			};
		},
		created() {
			this.limits = JSON.parse(sessionStorage.getItem("limit"));
			const params = this.limits.buttonTreeDto.filter(
				(item) => item.menuCode === "unusualOrderCode"
			);
			params[0].buttonList.forEach((item) => {
				this.parArray.push(item.code);
			});
		 
		// exType 0是退货接口 1是拒收或者被退货接口
		// orderType 1,2 (5 内部出库)
			if (
				(this.queryType.exType == 0 && !this.queryType.orderType && this.queryType.fixDetail != 2) ||
				(this.queryType.exType == 0 &&
					(this.queryType.orderType == 2 || this.queryType.orderType == 5 || this.queryType.orderType == 1))
			) {
			 
				this.axios
					.get(
						"/order/order/return/returnGoods/detail?id=" +
						this.queryType.id +
						"&fixDetail=" +
						this.queryType.fixDetail
					)
					.then((res) => {
						this.tableData = res.data;
						if (this.tableData.orderReturnCommodityList) {
							for (let temp of this.tableData.orderReturnCommodityList) {
								this.$set(temp, "numberC", temp.number);
							}
						}
						if (this.tableData.orderReturnComplimentaryList) {
							for (let temp of this.tableData.orderReturnComplimentaryList) {
								this.$set(temp, "numberC", temp.number);
							}
						}
						this.oldOrder = [];
						this.oldOrder.push(res.data.orderResponse.orderUser);
					});
			} else {
				this.axios
					.get("/order/order/reject/detail?id=" + this.queryType.id)
					.then((res) => {
						this.tableData = res.data;
						if (this.tableData.orderReturnCommodityList) {
							for (let temp of this.tableData.orderReturnCommodityList) {
								this.$set(temp, "numberC", temp.number);
							}
						}
						if (this.tableData.orderReturnComplimentaryList) {
							for (let temp of this.tableData.orderReturnComplimentaryList) {
								this.$set(temp, "numberC", temp.number);
							}
						}
						this.oldOrder = [];
						this.oldOrder.push(res.data.orderResponse.orderUser);
					});
			}

			this.axios
				.get("/sys/v1/common/by/group?groupId=courier_company", {
					headers: {
						isLoading: false,
					},
				})
				.then((res) => {
					// console.log(res);
					if (res.code == 0) {
						this.companys = res.data;
					} else {
						this.$message.error(res.message);
					}
				});
		},
		methods: {
			toOrder() {
				this.$router.push({
					name: "unusualOrder",
					query: {
						tabName: this.queryType.tabName,
					},
				});
			},
			submintEvent() {
				let o1 = [];
				let o2 = [];
				if (this.tableData.orderReturnCommodityList) {
					this.tableData.orderReturnCommodityList.forEach((e) => {
						let temp = JSON.parse(JSON.stringify(e));
						temp.number = temp.numberC;
						o1.push(temp);
					});
				}
				if (this.tableData.orderReturnComplimentaryList) {
					this.tableData.orderReturnComplimentaryList.forEach((e) => {
						let temp = JSON.parse(JSON.stringify(e));
						temp.number = temp.numberC;
						o2.push(temp);
					});
				}
				this.$msgbox({
						title: this.parArray.indexOf("byReturnCode") == -1 ?
							"确定提交退货申请" :
							"确定关闭",
						message: this.parArray.indexOf("byReturnCode") == -1 ?
							"总计退货数量" + this.totalCout(1) :
							"请确是否关闭订单",
						showCancelButton: true,
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						beforeClose: (action, instance, done) => {
							if (action === "confirm") {
								instance.confirmButtonLoading = true;
								instance.confirmButtonText = "执行中...";
								setTimeout(() => {
									done();
									setTimeout(() => {
										instance.confirmButtonLoading = false;
									}, 300);
								}, 3000);
							} else {
								done();
							}
						},
					})
					.then((res) => {
						if (this.queryType.exType == 0 && this.queryType.fixDetail == 1) {
							this.axios
								.post("/order/order/return/update/submit", {
									request: {
										comment: this.textarea,
										orderReturnCommodityRequestList: o1.filter(
											(res) => res.number > 0
										),
										orderReturnComplimentaryRequestList: o2.filter(
											(res) => res.number > 0
										),
										returnMoney: this.salay,
										shouldReturnMoney: this.totalCout(2),
										returnOrderId: this.tableData.returnOrderId,
									},
								})
								.then((res) => {
									if (!res.code) {
										this.$message.success("申请成功");
										this.$router.go(-1);
									} else {
										this.$message.info(res.message);
									}
									console.log(res);
								});
						} else if (
							this.queryType.exType == 0 &&
							this.queryType.fixDetail == 2 &&
							this.parArray.indexOf("byReturnCode") == -1
						) {
							this.axios
								.post("/order/order/return/confirm/receipt", {
									request: {
										approvalStatus: 1,
										comment: this.textarea,
										orderReturnCommodityRequestList: o1.filter(
											(res) => res.number > 0
										),
										orderReturnComplimentaryRequestList: o2.filter(
											(res) => res.number > 0
										),
										returnOrderId: 1,
										updatedBy: 1,
									},
								})
								.then((res) => {
									if (!res.code) {
										this.$message.success("申请成功");
										this.$router.go(-1);
									} else {
										this.$message.info(res.message);
									}
									console.log(res);
								});
						} else if (
							this.queryType.exType == 1 &&
							this.queryType.orderType == 0 &&
							this.parArray.indexOf("byReturnCode") == -1
						) {
							this.axios
								.post("/order/order/reject/confirmReject", {
									rejectId: this.queryType.id,
								})
								.then((res) => {
									if (!res.code) {
										this.$message.success("提交成功");
										this.$router.go(-1);
									} else {
										this.$message.error(res.message);
									}
								});
						} else if (
							this.queryType.exType == 1 &&
							this.queryType.orderType == 1 &&
							this.parArray.indexOf("byReturnCode") == -1
						) {
							this.axios
								.post("/order/order/reject/update", {
									comment: this.textarea,
									proInsId: this.tableData.procInstId,
									rejectId: this.tableData.returnOrderId,
									shouldReturnMoney: this.tableData.shouldReturnMoney,
									returnMoney: this.salay,
								})
								.then((res) => {
									if (!res.code) {
										this.$router.go(-1);
									} else {
										this.$message.warning(res.message);
									}
								});
						} else if (this.parArray.indexOf("byReturnCode") != -1) {
							this.axios
								.get(
									"/order/order/reject/close/recovery?id=" +
									this.tableData.orderId
								)
								.then((res) => {
									console.log(res);
								});
						}
					})
					.catch(() => {});
			},
			reject() {
				let orderIds = [];
				let proInsIds = [];
				orderIds.push(this.tableData.orderId);
				proInsIds.push(this.tableData.procInstId);
				this.axios
					.post("/order/order/reject/commit", {
						comment: this.textarea1,
						orderIds: orderIds,
						orderType: 0,
						proInsIds: proInsIds,
						result: this.rejectType,
					})
					.then((res) => {
						if (!res.code) {
							this.$message.success("申请成功");
						} else {
							this.$message.warning(res.message);
						}
						this.dialogVisible = false;
						this.$router.go(-1);
					});
			},
			inp(e) {
				this.salay = e;
			},
			img(img) {
				return this.ImgHttps + img;
			},
		},
		computed: {
			totalCout() {
				return (v) => {
					let count = 0;
					if (this.tableData.orderReturnCommodityList) {
						this.tableData.orderReturnCommodityList.forEach((e) => {
							if (!v) {
								count += e.number;
							} else if (v == 1) {
								if (this.queryType.fixDetail == 1) {
									count += e.numberC ? e.numberC : 0;
								} else {
									count += e.number;
								}
							} else if (v == 2) {
								if (this.queryType.fixDetail == 1) {
									count += e.numberC * e.price;
								} else {
									count += e.total;
								}
							}
						});
					}
					if (this.tableData.orderReturnComplimentaryList) {
						this.tableData.orderReturnComplimentaryList.forEach((e) => {
							if (!v) {
								count += e.number;
							} else if (v == 1) {
								if (this.queryType.fixDetail == 1) {
									count += e.numberC ? e.numberC : 0;
								} else {
									count += e.number;
								}

								// if (
								//   (this.queryType.exType == 1 && this.queryType.orderType == 0) ||
								//   (this.queryType.exType == 0 &&
								//     (this.queryType.orderType == 2 ||
								//       this.queryType.orderType == 1))
								// ) {
								//   count += e.receivedNo;
								// }
							}
						});
					}

					return count ? count.toFixed(2) : 0;
				};
			},
			test() {
				return function(v) {
					let count = 0;
					if (this.tableData.orderReturnCommodityList) {
						this.tableData.orderReturnCommodityList.forEach((e) => {
							if (!v) {
								count += e.receivedNo;
							} else if (v == 1) {
								count += e.destroyNo;
							} else if (v == 2) {
								count += e.brokenNo;
							} else if (v == 3) {
								count += e.receivedNo * e.price;
							}
						});
					}
					if (this.tableData.orderReturnComplimentaryList) {
						this.tableData.orderReturnComplimentaryList.forEach((e) => {
							if (!v) {
								count += e.receivedNo;
							} else if (v == 1) {
								count += e.destroyNo;
								} else if (v == 2) {
								count += e.brokenNo;
							}
						});
					}

					return count ? count : 0;
				};
			},
		},
	};
</script>

<style scoped lang="scss">
	.totalAll {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		padding: 10px;
		border-bottom: 1px solid #e3e7ec;

		span {
			margin-left: 30px;
			font-size: 14px;
			font-weight: 550;
		}
	}

	.div1 {
		margin-left: -16px;
		background: url(../../../assets/breadcrumb2.png);
		width: 120px;
		height: 30px;
		text-align: center;
		line-height: 30px;
		color: #2d7edf;
	}

	.div2 {
		margin-left: -16px;
		background: url(../../../assets/breadcrumb1.png);
		width: 120px;
		height: 30px;
		text-align: center;
		line-height: 30px;
		color: #fff;
	}

	.div2:hover {
		cursor: pointer;
	}

	.goods {
		background: #fff;
		padding: 10px 12px;
		margin-top: 10px;
		border-radius: 6px;
	}

	.basic {
		// width:94%;
		background: #fff;
		padding: 10px;

		.ul {
			padding: 10px 0;

			li {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				line-height: 35px;

				p {
					margin-right: 20px;
					font-size: 15px;
					color: #666;
					white-space: nowrap;
					overflow: hidden;
				}

				span {
					margin-right: 5px;
					font-size: 15px;
					color: #666;
					white-space: nowrap;
					overflow: hidden;
				}
			}
		}
	}

	.contentTemp {
		/deep/.el-input__inner {
			width: 150px;
		}

		.fontTemp {
			margin-top: 10px;
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			padding: 5px 0px;

			p {
				span {
					color: #ff5656;
				}

				font-size: 14px;
				color: #666666;
			}

			>div {
				margin-left: 10px;

				// /deep/.el-input__inner {
				//   height: 30px;
				//   line-height: 30px;
				// }

				// /deep/.el-input__icon {
				//   height: 30px;
				//   line-height: 30px;
				// }
			}

			.span {
				color: #666666;
				font-weight: 400;
				line-height: 20px;
				font-size: 14px;
				margin-right: 40px;
				word-spacing: 8px;
			}

			.span1 {
				display: inline-block;
				width: 50px;
				text-align: justify;
				text-justify: distribute-all-lines;
				/*ie6-8*/
				text-align-last: justify;
				/* ie9*/
				-moz-text-align-last: justify;
				/*ff*/
				-webkit-text-align-last: justify;
				/*chrome 20+*/
			}

			@media screen and (-webkit-min-device-pixel-ratio: 0) {

				/* chrome*/
				.test1:after {
					content: ".";
					display: inline-block;
					width: 100%;
					overflow: hidden;
					height: 0;
				}
			}
		}
	}

	.header {
		font-size: 16px;
		color: #2d7edf;
		padding-bottom: 10px;
		border-bottom: 2px solid #e3e7ec;
	}

	.numer {
		display: flex;
		flex-direction: column;
		line-height: 30px;
	}

	/deep/.el-table .has-gutter .is-leaf {
		color: #333;
		text-align: center;
	}

	/deep/.el-table td,
	.el-table th {
		text-align: center;
	}

	.total {
		background-color: #fff;
		padding: 10px;

		.deal {
			width: 100%;
			justify-content: flex-end;
			display: flex;
			line-height: 30px;

			>p {
				font-size: 14px;
				color: #5276e9;
				font-weight: 600;
				margin: 15px 80px 15px 15px;
			}
		}

		.before {
			width: 100%;
			text-align: right;
			border-bottom: 1px solid #d9d9d9;
			padding-bottom: 15px;

			p {
				display: inline-block;
				color: #333;
				font-size: 14px;
				margin-left: 15px;
				font-weight: 600;
			}
		}

		.back {
			width: 100%;
			text-align: right;
			border-bottom: 1px solid #d9d9d9;
			padding: 10px 0;

			p {
				display: inline-block;
				color: #333;
				font-size: 14px;
				margin-left: 25px;
				font-weight: 600;
			}

			p:nth-child(2) {
				padding: 0 30px;
			}
		}

		.deal {
			width: 100%;
			text-align: right;

			>p {
				font-size: 14px;
				color: #5276e9;
				font-weight: 600;
				margin: 15px 80px 15px 15px;
				// width:250px;
				// text-align: left;
			}

			div {
				p {
					display: inline-block;
					margin-right: 10px;
					font-size: 14px;
					color: #5276e9;
					font-weight: 600;

					span {
						color: #ff5656;
						font-weight: normal;
					}
				}

				/deep/.el-input__inner {
					width: 100px;
					height: 25px;
					line-height: 25px;
					background: #f2f2f2;
					border-radius: 4px;
					border: none;
				}
			}
		}
	}

	.notes {
		margin: 10px 0;
		background: #fff;
		padding: 10px;

		div {
			margin: 10px 0;
		}
	}

	.oldOrder {
		margin-top: 10px;
		background: #fff;

		.title {
			color: #2d7edf;
			padding: 10px;
			border-bottom: 1px solid #eee;
		}
	}

	.submit {
		background-color: #fff;
		padding: 10px;
		display: flex;
		justify-content: flex-end;
		position: fixed;
		bottom: 0;
		z-index: 101;
		left: 0;
		right: 0;

		p {
			line-height: 30px;
			height: 30px;
			background: #4168e7;
			border-radius: 4px;
			width: 100px;
			color: #fff;
			font-size: 14px;
			text-align: center;
		}
	}
</style>
